<h1><i class="fontello-icon-chart-line"></i> Reportes</h1>

<div class="tabs2" data-view="Rin.Views.Tabs" data-default="reportesPlanilla">
	<a data-name="reportesPlanilla"><span>Reportes de Planilla</span></a>
	<a data-name="reportesPresupuestarios"><span>Reportes Presupuestarios</span></a>
</div>

<div>

	<div data-name="reportesPlanilla">
		<h2>Reportes de Planilla</h2>

		<div class="tabs2" data-view="Rin.Views.Tabs" data-default="reporteCuentaPresupuestaria">
			<a data-name="reporteCuentaPresupuestaria"><span>Reporte de Cuenta Presupuestaria</span></a>
			<a data-name="reporteIngresos"><span>Reporte de Ingresos</span></a>
			<a data-name="reporteDeducciones"><span>Reporte de Deducciones</span></a>
		</div>

		<div>
			<!-- Reporte de Cuenta Presupuestaria Independiente (ECPI) -->
			<div data-name="reporteCuentaPresupuestaria">

				<div class="control-buttons">
					<button onclick="Reportes.ECPI.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

					<span data-content="html" data-model="Reportes.ECPI.mPaginacion" data-observe="pagina, paginas">
						<em>Página:</em> [[pagina]] / [[paginas]]
					</span>

					<button onclick="Reportes.ECPI.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>
					<button onclick="Reportes.ECPI.cargarLista()"><i class="fontello-icon-ccw"></i></button>

					<button class="float-right very-bold" onclick="Reportes.ECPI.filtrarLista();"><i class="fontello-icon-search"></i> Filtrar</button>

					<button class="float-right" onclick="Reportes.ECPI.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
					<button class="float-right" onclick="Reportes.ECPI.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>

					<div class="filters">

						<div class="filter">
							<label><i class="fontello-icon-filter"></i> Cargo:</label>
							<select style="width: 130px;" data-model="Reportes.ECPI.mFiltros" data-content="html" data-observe="enumCargos" data-property="cargo">
								<option value="">(Todos)</option>
								[[#each enumCargos]]
								<option value="[[id]]">[[value]]</option>
								[[/each]]
							</select>
						</div>

						<div class="filter">
							<label><i class="fontello-icon-filter"></i> Departamento:</label>
							<select style="width: 130px;" data-model="Reportes.ECPI.mFiltros" data-content="html" data-observe="enumDeptos" data-property="depto">
								<option value="">(Todos)</option>
								[[#each enumDeptos]]
								<option value="[[id]]">[[value]]</option>
								[[/each]]
							</select>
						</div>

						<div class="filter">
							<label><i class="fontello-icon-filter"></i> Cuenta Presupuestaria:</label>
							<input style="width: 140px;" type="text" data-model="Reportes.ECPI.mFiltros" data-property="cuenta_presupuestaria"/>
						</div>

						<div class="filter">
							<label><i class="fontello-icon-filter"></i> Estado:</label>
							<input style="width: 50px;" type="text" data-model="Reportes.ECPI.mFiltros" data-property="estado"/>
						</div>

						<div class="filter">
							<label><i class="fontello-icon-filter"></i> Fecha de Contrato:</label>
							<input style="width: 65px; margin-right: 0;" type="text" data-datepicker="true" data-model="Reportes.ECPI.mFiltros" data-property="min_fecha_contrato"/>
							-
							<input style="width: 65px;" type="text" data-datepicker="true" data-model="Reportes.ECPI.mFiltros" data-property="max_fecha_contrato"/>
						</div>

						<div class="filter">
							<label><i class="fontello-icon-filter"></i> Fecha de Acuerdo:</label>
							<input style="width: 65px; margin-right: 0;" type="text" data-datepicker="true" data-model="Reportes.ECPI.mFiltros" data-property="min_fecha_acuerdo"/>
							-
							<input style="width: 65px;" type="text" data-datepicker="true" data-model="Reportes.ECPI.mFiltros" data-property="max_fecha_acuerdo"/>
						</div>

					</div>

				</div>

				<div class="table" data-content="html" data-model="Reportes.ECPI.mDatos" data-observe="lista">
					[[#if lista_vacia]]
						<div class="header">
							<span class="no-data">No hay datos que mostrar por el momento.</span>
						</div>
					[[:else]]
						<div class="header">
							<span>Cod. Empleado</span>
							<span>Nombre</span>
							<span>Cargo</span>
							<span>Sueldo</span>
							<span>Fechas</span>
							<span>Tipo Planilla</span>
							<span>Estado</span>
							<span>Cta. Presupuestaria</span>
						</div>

						[[#each lista]]
						<div>
							<span><b>[[codigo_empleado]]</b><br/>[[identidad]]</span>
							<span><b>[[nombres]] [[apellidos]]</b><br/>[[DATE fecha_nacimiento]]<br/>[[GENDER sexo]]</span>
							<span><b>[[cargo]]</b><br/>[[departamento]]<br/>Cod. [[id_departamento]]</span>
							<span><b>[[CURRENCY sueldo]]</b><br/>Imp. Estatal <b>[[impuesto_estatal]]</b></span>
							<span>Contrato: <b>[[DATE fecha_contrato]]</b><br/>Acuerdo: <b>[[DATE acuerdo]]</b></span>
							<span>[[tipo_planilla]]</span>
							<span>[[estado]]</span>
							<span>[[cuenta_presupuestaria]]</span>
						</div>
						[[/each]]
					[[/if]]
				</div>

			</div>

			<!-- Reporte de Ingresos por Empleado (IXE) -->
			<div data-name="reporteIngresos">

				<div class="control-buttons">
					<button onclick="Reportes.IXE.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

					<span data-content="html" data-model="Reportes.IXE.mPaginacion" data-observe="pagina, paginas">
						<em>Página:</em> [[pagina]] / [[paginas]]
					</span>

					<button onclick="Reportes.IXE.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>
					<button onclick="Reportes.IXE.cargarLista()"><i class="fontello-icon-ccw"></i></button>

					<button class="float-right" onclick="Reportes.IXE.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
					<button class="float-right" onclick="Reportes.IXE.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>
				</div>

				<div class="table" data-content="html" data-model="Reportes.IXE.mDatos" data-observe="lista">
					[[#if lista_vacia]]
						<div class="header">
							<span class="no-data">No hay datos que mostrar por el momento.</span>
						</div>
					[[:else]]
						<div class="header">
							<span>Cod. Empleado</span>
							<span>Nombre</span>
							<span>Cargo</span>
							<span>Referencia</span>
							<span>Banco</span>
							<span>No. Cheque</span>
							<span>Tipo Planilla</span>
							<span>Cod. Ingreso</span>
							<span>Cantidad</span>
							<span>Tasa</span>
						</div>

						[[#each lista]]
						<div>
							<span><b>[[codigo_empleado]]</b><br/>[[identidad]]</span>
							<span>[[nombres]] [[apellidos]]</span>
							<span><b>[[cargo]]</b><br/>[[departamento]]<br/>Cod. [[id_departamento]]</span>
							<span>[[referencia]]</span>
							<span>[[banco]]</span>
							<span>[[cheque]]</span>
							<span>[[planilla]]</span>
							<span>[[codigo_ingreso]]</span>
							<span>[[CURRENCY cantidad]]</span>
							<span>[[PERCENT tasa]]</span>
						</div>
						[[/each]]
					[[/if]]
				</div>

			</div>

			<!-- Reporte de Deducciones por Empleado -->
			<div data-name="reporteDeducciones">

				<div class="control-buttons">
					<button onclick="Reportes.EXE.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

					<span data-content="html" data-model="Reportes.EXE.mPaginacion" data-observe="pagina, paginas">
						<em>Página:</em> [[pagina]] / [[paginas]]
					</span>

					<button onclick="Reportes.EXE.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>
					<button onclick="Reportes.EXE.cargarLista()"><i class="fontello-icon-ccw"></i></button>

					<button class="float-right" onclick="Reportes.EXE.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
					<button class="float-right" onclick="Reportes.EXE.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>
				</div>

				<div class="table" data-content="html" data-model="Reportes.EXE.mDatos" data-observe="lista">
					[[#if lista_vacia]]
						<div class="header">
							<span class="no-data">No hay datos que mostrar por el momento.</span>
						</div>
					[[:else]]
						<div class="header">
							<span>Cod. Empleado</span>
							<span>Nombre</span>
							<span>Cargo</span>
							<span>Tipo Planilla</span>
							<span>Cod. Ingreso Deduccion</span>
							<span>Cantidad Deduccion</span>
						</div>

						[[#each lista]]
						<div>
							<span><b>[[codigo_empleado]]</b><br/>[[identidad]]</span>
							<span>[[nombres]] [[apellidos]]</span>
							<span><b>[[cargo]]</b><br/>[[departamento]]<br/>Cod. [[id_departamento]]</span>
							<span>[[planilla]]</span>
							<span>[[codigo_ingreso_deduccion]]</span>
							<span>[[CURRENCY valor_deducciones]]</span>
						</div>
						[[/each]]
					[[/if]]
				</div>

			</div>
		</div>
	</div>

	<div data-name="reportesPresupuestarios">
		<h2>Reportes Presupuestarios</h2>

		<div class="tabs2" data-view="Rin.Views.Tabs" data-default="reportePrograma">
			<a data-name="reportePrograma"><span>Reporte por Programa</span></a>
			<a data-name="reporteGrupo"><span>Reporte por Grupo</span></a>
			<a data-name="reporteSubGrupo"><span>Reporte por Sub-Grupo</span></a>
		</div>

		<div>
			<div data-name="reportePrograma">

				<div class="control-buttons">
					<button onclick="Reportes.Programa.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

					<span data-content="html" data-model="Reportes.Programa.mPaginacion" data-observe="pagina, paginas">
						<em>Página:</em> [[pagina]] / [[paginas]]
					</span>

					<button onclick="Reportes.Programa.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>
					<button onclick="Reportes.Programa.cargarLista()"><i class="fontello-icon-ccw"></i></button>

					<button class="float-right" onclick="Reportes.Programa.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
					<button class="float-right" onclick="Reportes.Programa.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>

					<br/><br/>

					<label><i class="fontello-icon-filter"></i> Código de Programa:</label>
					<input style="width: 140px;" type="text" data-model="Reportes.Programa.mFiltros" data-property="programa"/>

					<button onclick="Reportes.Programa.filtrarLista();"><i class="fontello-icon-search"></i> Filtrar</button>

				</div>

				<div class="table" data-content="html" data-model="Reportes.Programa.mDatos" data-observe="lista">
					[[#if lista_vacia]]
						<div class="header">
							<span class="no-data">No hay datos que mostrar por el momento.</span>
						</div>
					[[:else]]
						<div class="header">
							<span>Cod. de Programa</span>
							<span>Presupuesto</span>
							<span>Transferencia</span>
							<span>Modificado</span>
							<span>Usado</span>
							<span>Disponible</span>
							<span>Porcentaje Usado</span>
							<span>Porcentaje Disponible</span>
						</div>

						[[#each lista]]
						<div>
							<span>[[programa]]</span>
							<span>[[presupuesto]]</span>
							<span>[[CURRENCY transferencia]]</span>
							<span>[[CURRENCY modificado]]</span>
							<span>[[CURRENCY usado]]</span>
							<span>[[CURRENCY disponible]]</span>
							<span>[[PERCENT porcentaje_usado]]</span>
							<span>[[PERCENT porcentaje_disponible]]</span>
						</div>
						[[/each]]
					[[/if]]
				</div>

			</div>

			<div data-name="reporteGrupo">

				<div class="control-buttons">
					<button onclick="Reportes.Grupo.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

					<span data-content="html" data-model="Reportes.Grupo.mPaginacion" data-observe="pagina, paginas">
						<em>Página:</em> [[pagina]] / [[paginas]]
					</span>

					<button onclick="Reportes.Grupo.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>
					<button onclick="Reportes.Grupo.cargarLista()"><i class="fontello-icon-ccw"></i></button>

					<button class="float-right" onclick="Reportes.Grupo.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
					<button class="float-right" onclick="Reportes.Grupo.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>

					<br/><br/>

					<label><i class="fontello-icon-filter"></i> Código de Grupo:</label>
					<input style="width: 140px;" type="text" data-model="Reportes.Grupo.mFiltros" data-property="grupo"/>

					<button onclick="Reportes.Grupo.filtrarLista();"><i class="fontello-icon-search"></i> Filtrar</button>
				</div>

				<div class="table" data-content="html" data-model="Reportes.Grupo.mDatos" data-observe="lista">
					[[#if lista_vacia]]
						<div class="header">
							<span class="no-data">No hay datos que mostrar por el momento.</span>
						</div>
					[[:else]]
						<div class="header">
							<span>Cod. Grupo</span>
							<span>Presupuesto</span>
							<span>Transferencia</span>
							<span>Modificado</span>
							<span>Usado</span>
							<span>Disponible</span>
							<span>Porcentaje Usado</span>
							<span>Porcentaje Disponible</span>
						</div>

						[[#each lista]]
						<div>
							<span>[[grupo]]</span>
							<span>[[presupuesto]]</span>
							<span>[[CURRENCY transferencia]]</span>
							<span>[[CURRENCY modificado]]</span>
							<span>[[CURRENCY usado]]</span>
							<span>[[CURRENCY disponible]]</span>
							<span>[[PERCENT porcentaje_usado]]</span>
							<span>[[PERCENT porcentaje_disponible]]</span>
						</div>
						[[/each]]
					[[/if]]
				</div>

			</div>

			<div data-name="reporteSubGrupo">

				<div class="control-buttons">
					<button onclick="Reportes.SubGrupo.pagAnterior()"><i class="fontello-icon-left-circle"></i></button>

					<span data-content="html" data-model="Reportes.SubGrupo.mPaginacion" data-observe="pagina, paginas">
						<em>Página:</em> [[pagina]] / [[paginas]]
					</span>

					<button onclick="Reportes.SubGrupo.pagSiguiente()"><i class="fontello-icon-right-circle"></i></button>
					<button onclick="Reportes.SubGrupo.cargarLista()"><i class="fontello-icon-ccw"></i></button>

					<button class="float-right" onclick="Reportes.SubGrupo.exportar(true);"><i class="fontello-icon-table"></i> Exportar Todo</button>
					<button class="float-right" onclick="Reportes.SubGrupo.exportar(false);"><i class="fontello-icon-eye"></i> Exportar Visible</button>

					<br/><br/>

					<label><i class="fontello-icon-filter"></i> Código de Sub-Grupo:</label>
					<input style="width: 140px;" type="text" data-model="Reportes.SubGrupo.mFiltros" data-property="subgrupo"/>

					<button onclick="Reportes.SubGrupo.filtrarLista();"><i class="fontello-icon-search"></i> Filtrar</button>
				</div>

				<div class="table" data-content="html" data-model="Reportes.SubGrupo.mDatos" data-observe="lista">
					[[#if lista_vacia]]
						<div class="header">
							<span class="no-data">No hay datos que mostrar por el momento.</span>
						</div>
					[[:else]]
						<div class="header">
							<span>Cod. Sub-Grupo</span>
							<span>Presupuesto</span>
							<span>Transferencia</span>
							<span>Modificado</span>
							<span>Usado</span>
							<span>Disponible</span>
							<span>Porcentaje Usado</span>
							<span>Porcentaje Disponible</span>
						</div>

						[[#each lista]]
						<div>
							<span>[[grupo]]</span>
							<span>[[presupuesto]]</span>
							<span>[[CURRENCY transferencia]]</span>
							<span>[[CURRENCY modificado]]</span>
							<span>[[CURRENCY usado]]</span>
							<span>[[CURRENCY disponible]]</span>
							<span>[[PERCENT porcentaje_usado]]</span>
							<span>[[PERCENT porcentaje_disponible]]</span>
						</div>
						[[/each]]
					[[/if]]
				</div>

			</div>

		</div>
	</div>

</div>
